<template>
	<view class="diy-search">
		<view class="search-box" :style="{backgroundColor: value.backgroundColor}" :class="value.borderType == 1?'':'ns-borderradius'">
			<view class="location" @click="$util.redirectTo('/otherpages/index/city/city')" v-if="city" :style="{color: value.textColor}">
				<text class="citys">{{ city }}</text>
				<text class="iconfont iconiconangledown"></text>
			</view>

			<view class="search-content" :style="{ backgroundColor: value.bgColor }" @click="search()">
				<input type="text" class="uni-input ns-font-size-base" maxlength="50" placeholder="商品搜索" :placeholder-class="value.textAlign == 'center'?'text_align':''"
				 v-model="searchText" confirm-type="search" @confirm="search()" disabled="true" :style="{ backgroundColor: value.bgColor}" />
				<text class="iconfont iconIcon_search" @click="search()"></text>
			</view>
			<!-- 扫一扫 -->
			<!-- #ifdef APP-PLUS || MP-WEIXIN -->
				<view class="scan" @click="sean()">
					<image class="img_img" :src="$util.img('upload/uniapp/scan.png')" mode="aspectFit"></image>
				</view>
			<!-- #endif -->
		</view>

		<uni-popup ref="sean_popup" type="center" class="wap-floating">
			<view class="title">
				确定{{poster_msg.user_name}}绑定为你的上级吗?
			</view>
			<view class="img-box">
				<image :src="$util.img(poster_msg.user_img)" mode=""></image>
			</view>
			<view class="message-box">
				<text>推荐码:</text>
				<text class="tuijian-code">{{poster_msg.invite_code}}</text>
			</view>
			<view class="btn-group">
				<button type="default" class="quxiao" @click="close_popup(1)">再想想</button>
				<button type="default" class="sue" @click="sue_popup()">确定</button>
			</view>
			<!-- <text class="iconfont iconroundclose" @click="closeNum"></text> -->
		</uni-popup>
		<uni-popup ref="sean_popup2" type="center" class="wap-floating">

			<view class="title">
				已经绑定{{poster_msg.user_name}}为你的上级
			</view>
			<view class="img-box">
				<image :src="$util.img(poster_msg.user_img)" mode=""></image>
			</view>
			<view class="message-box">
				<text>推荐码:</text>
				<text class="tuijian-code">{{poster_msg.invite_code}}</text>
			</view>
			<button type="default" class="sueed" @click="close_popup(2)">确定</button>
			<!-- <text class="iconfont iconroundclose" @click="closeNum"></text> -->
		</uni-popup>

		<ns-login ref="login"></ns-login>
	</view>
</template>

<script>
	// import uniGridItem from '@/components/uni-grid-item/uni-grid-item.vue';
	// 搜索
	export default {

		components: {
			// uniGrid,
			// uniGridItem,
		},
		name: 'diy-search',
		props: {
			value: {
				type: Object,
				default: () => {
					return {};
				}
			},
			city: {
				type: String,
				value: ''
			},
			siteId: {
				type: [Number, String],
				default: 0
			},
			redirectUrl: {
				type: [String],
				default: '/otherpages/goods/search/search'
			}
		},
		data() {
			return {
				token: '',
				searchText: '',
				cityAddon: 0,
				poster_msg: {
					invite_code: '',
					user_img: '',
					user_name: ''
				} //扫码时二维码里面的信息
			};
		},

		onShow() {

		},


		// created() {

		// },
		methods: {
			search() {
				this.$util.redirectTo(this.redirectUrl);
			},

			sean() {
				console.log('点击扫一扫');
				this.token = uni.getStorageSync('token');
				// 验证登录
				if (!this.token) {
					this.$util.redirectTo('/pages/login/login/login', {
						back: '/pages/index/index/index'
					});
					return;
				}
				uni.scanCode({
					success: (res) => {
						//console.log('扫码结果');
						//console.log(res);
						let path = res.result
						if(-1 != path.indexOf('/pages/index/index/index')){
							//首页有公共处理
							let arr = path.split('/h5/');
							this.$util.redirectTo('/' + arr[1], {}, 'reLaunch');
						}else if(-1 != path.indexOf('/otherpages/shop/index/index')){
							//进入商家
							console.log('进入商家');
							this.seanResShop(path);
						}else if(-1 != path.indexOf('/login/register/phone_reg')){
							//注册/绑定邀请人
							console.log('绑定邀请人');
							this.seanResBindInviteRelation(path);
						}
					}
				});
			},
			
			//扫码注册
			seanResBindInviteRelation(res){
				console.log(res);
				let string1 = res.split('?');
				let string2 = string1[1].split('=');

				this.poster_msg.invite_code = string2[1]
				this.GetpostMsg(this.poster_msg.invite_code)
			},
			
			//扫码进入商家
			seanResShop(res){
				this.$util.redirectTo(res);
			},

			close_popup(e) {
				if (e == 1) {
					this.$refs.sean_popup.close()
				} else {
					this.$refs.sean_popup2.close()
				}
			},
			sue_popup(e) {
				this.close_popup(1)
				// 提交绑定
				this.$api.sendRequest({
					url: '/api/member/updateInviteRelation',
					data: {
						token: uni.getStorageSync('token'),
						source_member: this.poster_msg.user_id
					},
					success: res => {
						console.log(res)
						if (res.code == 0) {
							uni.showToast({
								title: '绑定成功~'
							})
						} else {
							uni.showToast({
								title: res.message,
								icon: 'none'
							})
						}
					}
				});
			},
			GetpostMsg(e) {
				this.$api.sendRequest({
					url: '/api/member/scanBindVerify',
					data: {
						token: uni.getStorageSync('token'),
						invite_code: e
					},
					success: res => {
						console.log(res)
						if (res.code == 0) {
							this.poster_msg.user_img = res.data.source_member_info.headimg
							this.poster_msg.user_name = res.data.source_member_info.show_name
							this.poster_msg.user_id = res.data.source_member_info.member_id
							if (res.data.is_bind == 0) {
								console.log('aaaaaaaaaaaaaaa')
								this.$refs.sean_popup.open()
							} else {
								this.$refs.sean_popup2.open()
							}
						} else {
							uni.showToast({
								title: res.message,
								icon: 'none'
							})
						}
					}
				});
			},

			redirectToLink(url) {
				if (!uni.getStorageSync('token')) {
					this.$refs.login.open(url);
				} else {
					this.$util.redirectTo(url);
				}
			},
		}
	};
</script>

<style lang="scss">
	.text_align {
		text-align: center;
	}

	.diy-search {
		.scan {
			display: flex;
			flex-direction: column;
			justify-content: center;
			// padding-left: 26px;
		}

		.search-box {
			position: relative;
			padding: 20rpx;
			display: flex;
		}

		.location {
			height: 80rpx;
			line-height: 80rpx;
			padding-right: 10rpx;
			font-weight: 600;
			display: flex;
			align-items: center;

			.citys {
				display: inline-block;
				max-width: 112rpx;
				overflow: hidden;
				text-overflow: ellipsis;
				white-space: nowrap;

			}

		}

		.location .iconiconangledown {
			display: inline-block;
			font-weight: bold;
			font-size: 32rpx;

		}

		.search-content {
			border-radius: 40rpx;
			flex: 1;
		}

		.search-content input {
			box-sizing: border-box;
			display: block;
			height: 80rpx;
			width: 100%;
			padding: 0 20rpx 0 40rpx;
			background: #f4f4f4;
			color: #333333;
			border-radius: 40rpx;
		}

		.search-content .iconfont {
			position: absolute;
			top: 50%;
			right: 40rpx;
			transform: translateY(-50%);
			font-size: 40rpx;
			z-index: 10;
			color: #89899a;
			width: 80rpx;
			text-align: center;
		}

		.ns-borderradius {
			border-radius: 100rpx;
		}
	}


	.wap-floating {

		// background-color: #fff;
		// position: absolute;
		// left:10px;
		// top:10px;
		// z-index: 1000000;
		.title {
			border-bottom: 1rpx solid #F8F8F8;
			width: 550rpx;
			padding-bottom: 20RPX;
			margin: 30rpx;
			font-size: 30rpx;
			text-align: center;
		}

		.img-box {
			width: 100%;
			margin: 0 auto;
			text-align: center;
			margin-bottom: 20rpx;

			image {
				border-radius: 50%;
				height: 150rpx;
				width: 150rpx;
			}
		}

		.message-box {
			display: flex;
			justify-content: center;
			text-align: center;
			margin-bottom: 30rpx;

			text {
				line-height: 28rpx;
				font-size: 28rpx !important;
				color: #000000;
			}

			.tuijian-code {
				margin-left: 10rpx;

			}
		}

		.btn-group {
			display: flex;

			button {
				width: 48%;
				height: 90rpx;
				margin: 0;
				flex: 1;
				border-radius: 12rpx;
				padding: 0;
				line-height: 90rpx;
				color: white;
				font-size: 30rpx;
				letter-spacing: 2rpx;
				margin: 0 20rpx;
				margin-bottom: 20rpx;
			}

			.sue {
				background-color: #FF4544;
			}

			.quxiao {
				background-color: #D4D4D4;
			}
		}

		.sueed {
			background-color: #FF4544;
			height: 90rpx;
			margin: 0;
			flex: 1;
			color: white;
			border-radius: 12rpx;
			padding: 0;
			line-height: 90rpx;
			color: white;
			font-size: 30rpx;
			letter-spacing: 2rpx;
			margin: 0 20rpx;
			margin-bottom: 20rpx;
		}
	}

	// /deep/ .uni-popup__wrapper.uni-custom.center .uni-popup__wrapper-box {
	// 		border-radius: 15rpx;
	// 	}
</style>
